<template>
  <baseCard :title="title">
    <template #content>
      <div class="serve">
        <div class="serveItem" v-for="item in serveList">
          <ServerCard :info="item" />
        </div>
      </div>
    </template>
  </baseCard>
</template>

<script lang="ts" setup name="ServerProject">
import ServerCard from '@/components/serverCard/index.vue'
import baseCard from '@/components/baseCard/index.vue'

const title = '服务项目 '

const serveList = [
  {
    title: 'APP开发',
    img: 'https://www.dlsibo.com/img/Home_APP.png',
    describe:
      '专注于iOS与安卓APP开发，丰富的项目开发经验，为各行业企业开发兼备实用性和营销性的APP应用软件，安全稳定的技术运维服务，为您提供APP开发的解决方案。'
  },
  {
    title: '网站开发',
    img: 'https://www.dlsibo.com/img/Home_APP.png',
    describe:
      '专业开发团队提供技术咨询，需求定制质量风控，跟踪等全方位服务，根据需求，提供高端型企业网站，响应式企业建站，自适应，门户等各行业定制开发服务。'
  },
  {
    title: '微信开发',
    img: 'https://www.dlsibo.com/img/Home_APP.png',
    describe:
      '基于微信为客户提供开发，维护一体化解决方案，针对需求提供专业微信公众号，小程序开发服务，帮助客户实现线上线下业务互通。'
  },
  {
    title: '软件定制',
    img: 'https://www.dlsibo.com/img/Home_APP.png',
    describe:
      '专业的开发团队为项目提供需求咨询梳理，策划，开发服务，全流程可视化把控，保障方案完整落地。'
  }
]
</script>

<style lang="less" scoped>
.serve {
  width: 1320px;
  display: flex;
  justify-content: center;
  .serveItem {
    flex: 1;
    height: 300px;
  }
}
</style>
